<template>
  <div>
    <van-nav-bar left-arrow title="编辑" @click-left="onClickLeft">
      <template #right>
        <van-icon name="wap-home-o" size="24" />
      </template>
    </van-nav-bar>
    <div class="cust">
      <van-field
        v-model="custNameVal"
        label="客户姓名"
        placeholder="请输入内容"
        input-align="right"
      />
      <van-field
        v-model="contactVal"
        label="联系方式"
        placeholder="请输入内容"
        input-align="right"
      />
    </div>
    <div>
      <van-field
        v-model="educationVal"
        label="学历"
        placeholder="请输入内容"
        input-align="right"
      />
      <van-field
        v-model="ageVal"
        label="年龄"
        placeholder="请输入内容"
        input-align="right"
      />
      <van-field
        v-model="sexVal"
        label="性别"
        placeholder="请输入内容"
        input-align="right"
      />
      <van-field
        v-model="cityNameVal"
        label="所属城市"
        placeholder="请输入内容"
        input-align="right"
      />
      <van-field
        v-model="companyVal"
        label="公司名称"
        placeholder="请输入内容"
        input-align="right"
      />
      <van-field
        v-model="positionVal"
        label="职务"
        placeholder="请输入内容"
        input-align="right"
      />
    </div>
    <div class="btn">
      <van-button round type="info" @click="tijiao">提交</van-button>
    </div>
  </div>
</template>

<script>
import { CustEdit,GetCustData } from "@/request/api";
export default {
  data() {
    return {
      custNameVal: "",
      contactVal: "",
      educationVal: "",
      ageVal: "",
      sexVal: "",
      cityNameVal: "",
      companyVal: "",
      positionVal: "",
      // 初始数据

    };
  },
  methods: {
    onClickLeft() {
      this.$router.go(-1);
    },
    tijiao() {
      CustEdit({
        custName: this.custNameVal,
        cityName: this.cityNameVal,
        company: this.companyVal,
        position: this.positionVal,
        telephone: this.contactVal,
        education: this.educationVal,
        sex: this.sexVal,
        age: this.ageVal,
        id: this.$route.query.id,
      }).then((res) => {
        console.log("修改成功");
      });
    },
  },
  created() {
    GetCustData(this.$route.query.id).then((res) => {
      console.log(res);
      this.custNameVal = res.data.custName;
      this.contactVal = res.data.telephone;
      this.educationVal = res.data.education;
      this.sexVal = res.data.sex;
      this.cityNameVal = res.data.cityName;
      this.positionVal = res.data.position;
      this.ageVal = res.data.age
      this.companyVal = res.data.company
    });
  },
};
</script>
 
<style lang = "less" scoped>
.van-nav-bar {
  background-color: rgb(6, 6, 139);
  /deep/.van-nav-bar__title,
  /deep/.van-icon {
    color: #fff;
  }
  /deep/.van-nav-bar__text {
    color: #fff;
  }
}
.cust {
  margin: 10px 0;
}
.btn {
  position: fixed;
  bottom: 0;
  left: 0;
  width: 100%;
  .van-button {
    width: 100%;
  }
}
</style>